<template>
	<view class="pageBg">
		<banner :banner="banner"></banner>
		<navList></navList>
		<laziness></laziness>
		<!--   -->
		<leader v-if="data.course" :listData="data.course" title="未来学社" @mode="courseMode"></leader>
		<!--  @mode="courseMode" -->
		<leader v-if="data.formerlyGoods" NoStudyGroup @mode="previousPeriodMode(1)" title="雾宝展-往期展会" :listData="data.formerlyGoods" @goodsDetails="goodsDetails">
			
		</leader>
		<view class="exhibition">
			<view class="header spaceBetween">
				<view class="title">雾宝展-举办中的展会</view>
				<view class="mode flex" @click="previousPeriodMode(2)">
					<view class="">更多</view>
					<image class="navto" src="/static/images/navto.svg" mode=""></image>
				</view>
			</view>
			<exhibitionList v-if="data.NowGoods" detClick pageType="2" :list="data.NowGoods"></exhibitionList>
		</view>
		<view class="exhibition">
			<view class="header spaceBetween">
				<view class="title">雾宝展-近期举办的展会</view>
				<view class="mode flex" @click="previousPeriodMode(3)">
					<view class="">更多</view>
					<image class="navto" src="/static/images/navto.svg" mode=""></image>
				</view>
			</view>
			<exhibitionList v-if="data.plenaryGoods" detClick pageType="2" :list="data.plenaryGoods"></exhibitionList>
		</view>
	</view>
</template>

<script>
	import navList from '@/components/index/navList/navList.vue';
	import leader from '@/components/index/leader/leader.vue';
	import goodlist from '@/components/index/goodlist/goodlist.vue';
	import banner from '@/components/index/banner/banner.vue';
	import laziness from '@/components/index/laziness/laziness.vue';
	import { underDevelopment } from '@/utils/utils.js';
	import exhibitionList from '@/components/wbz/exhibitionCard/list.vue';
	export default {
		components: { navList, leader, goodlist, banner, laziness, exhibitionList },
		data() {
			return {
				banner: [],
				data: {},
			};
		},
		onShow() {
			this.init();
		},
		methods: {
			async init() {
				const bannerRes = await this.$api.Adlists({ pid: 1 });
				this.banner = bannerRes.data;
				const { data } = await this.$api.index();
				this.data = data;
			},
			goodsDetails({ item }) {
				uni.navigateTo({
					url: '/pages/wbz/details/details?id=' + item.id + '&type=2',
				});
			},
			courseMode() {
				uni.navigateTo({
					url: '/pages/index/future/future',
				});
			},
			previousPeriodMode(e) {
				uni.navigateTo({
					url: '/pages/index/exhibition/exhibition?time_type='+e,
				});
			},
		},
	};
</script>

<style lang="scss" scoped>
	.pageBg {
		.previousEventsList {
			overflow: hidden;
			overflow-x: scroll;
			width: $connet-width;
			margin: 0 auto;
			min-height: 40rpx;
			white-space: nowrap;
			.item {
				display: inline-block;
				margin-right: $submargin-width;
				background: #1fc28b;
				border-radius: 20rpx 20rpx 20rpx 20rpx;
				font-size: $uni-font-size-10;
				line-height: 40rpx;
				color: #ffffff;
				padding: 0 20rpx;
			}
		}
		.exhibition {
			overflow: hidden;
			.header {
				margin: $margin-width auto;
				overflow: hidden;
				width: $connet-width;

				.title {
					font-weight: bold;
					color: #000000;
					font-size: $uni-font-size-14;
				}

				.mode {
					font-weight: 400;
					color: #1fc28b;
					font-size: $uni-font-size-10;
					align-items: center;
					.navto {
						width: 30rpx;
						height: 25rpx;
					}
				}
			}
		}
	}
</style>
